<template>
  <div>
    <el-card style="width: 100%" v-loading="loading">
      <div style="width: 800px; margin: 0 auto">
        <el-form :model="queryParams" :rules="rules" ref="queryParams-form" label-width="200px"
          class="demo-queryParams">
          <el-form-item label="同步数据过期时间(天):" prop="expireDataDays">
            <el-input v-model="queryParams.expireDataDays"></el-input>
          </el-form-item>
          <el-form-item label="系统日志过期时间(天):" prop="expireLogDays">
            <el-input v-model="queryParams.expireLogDays"></el-input>
          </el-form-item>
          <el-form-item label="刷新监控频率(秒):" prop="refreshIntervalSeconds">
            <el-input v-model="queryParams.refreshIntervalSeconds"></el-input>
          </el-form-item>

          <el-form-item label="记录同步成功数据:" prop="enableStorageWriteSuccess">
            <el-switch :inactive-value="false" :active-value="true" v-model="queryParams.enableStorageWriteSuccess"
              active-color="#13ce66" inactive-color="#ff4949">
            </el-switch>
          </el-form-item>
          <el-form-item label="记录同步失败数据:" prop="enableStorageWriteFail">
            <el-switch :inactive-value="false" :active-value="true" v-model="queryParams.enableStorageWriteFail"
              active-color="#13ce66" inactive-color="#ff4949">
            </el-switch>
          </el-form-item>
          <el-form-item label="记录同步失败日志长度:" prop="maxStorageErrorLength">
            <el-input v-model="queryParams.maxStorageErrorLength"></el-input>
          </el-form-item>

          <el-form-item prop="enableStorageWriteFull">
            <template slot="label">
              <span>记录全量数据</span>
              <el-tooltip class="item" effect="dark" content="记录全量数据" placement="top-start">
                <span><i class="el-icon-question"></i>:</span>
              </el-tooltip>
            </template>
            <el-switch :inactive-value="false" :active-value="true" v-model="queryParams.enableStorageWriteFull"
              active-color="#13ce66" inactive-color="#ff4949">
            </el-switch>
          </el-form-item>
          <el-form-item label="CDN静态资源:" prop="enableCDN">
            <el-switch v-model="queryParams.enableCDN" active-color="#13ce66" :inactive-value="false"
              :active-value="true" inactive-color="#ff4949">
            </el-switch>
          </el-form-item>

          <el-form-item>
            <el-button type="primary" @click="handleSubmit">保存</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<script>
import { listSystem, updataSystem } from "@/api/setting/system";
export default {
  data() {
    return {
      loading: true,
      queryParams: {
        expireDataDays: "",//同步数据过期时间(天)
        expireLogDays: "",//系统日志过期时间(天)
        refreshIntervalSeconds: "", //刷新监控频率(秒)
        enableStorageWriteSuccess: "",//记录同步成功数据
        enableStorageWriteFail: "",//记录同步失败数据
        maxStorageErrorLength: "", //记录同步失败日志长度
        enableStorageWriteFull: "",//记录全量数据
        enableCDN: "", //CDN静态资源
      },
    };
  },
  created() {
    this.getList();
  },
  methods: {
    async handleSubmit() {
      try {
        this.loading = true;
        let queryParams = {
          ...this.queryParams,
          enableStorageWriteFail: this.queryParams.enableStorageWriteFail ? 'no' : '',
          enableStorageWriteFull: this.queryParams.enableStorageWriteFull ? 'no' : '',
          enableStorageWriteSuccess: this.queryParams.enableStorageWriteSuccess ? 'no' : '',
          enableCDN: this.queryParams.enableCDN ? 'no' : ''
        }
        await updataSystem(queryParams);
        this.getList();
      } catch (error) {
        this.loading = false;
      }
    },
    /** 查询岗位列表 */
    async getList() {
      try {
        this.loading = true;
        let res1 = await listSystem();
        console.log(res1.resultValue.config);
        Object.keys(this.queryParams).forEach(i => {
          this.queryParams[i] = res1.resultValue.config[i]
        });
        this.loading = false;
      } catch (e) {
        this.loading = false;
      }
    }
  },
};
</script>
<style lang="scss" scoped>
.brother+.brother {
  margin-left: 6px;
}

.table-price {
  text-align: left;
  padding-left: 40px;
}
</style>
